<template>
  <div class="app-container">
    <div>
      <BasicBusiness ref="basicBusinessRef" />
    </div>
    <div style="padding: 50px">
      <Step ref="stepRef" />
    </div>
    <el-row :gutter="15">
      <el-form
        ref="elForm"
        :model="formData"
        :rules="rules"
        size="medium"
        label-width="100px"
      >
        <el-form-item label="是否中标" prop="isBidding">
          <el-select
            v-model="formData.isBidding"
            placeholder="请选择是否中标"
            clearable
            :style="{ width: '100%' }"
          >
            <el-option
              v-for="(item, index) in isBiddingOptions"
              :key="index"
              :label="item.label"
              :value="item.value"
              :disabled="item.disabled"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="上传标书"
          prop="biddingFileId"
          v-if="formData.isBidding == 1"
        >
          <el-upload
            ref="biddingFileId"
            :file-list="biddingFileIdfileList"
            :action="biddingFileIdAction"
            :before-upload="biddingFileIdBeforeUpload"
            :on-success="handleUploadSuccess"
            :on-remove="handleRemove"
            :headers="headers"
            :limit="1"
          >
            <el-button size="small" type="primary" icon="el-icon-upload"
              >点击上传</el-button
            >
          </el-upload>
        </el-form-item>
        <el-form-item
          label="是否复盘"
          prop="isReplay"
          v-if="formData.isBidding == 2"
        >
          <el-select
            v-model="formData.isReplay"
            placeholder="请选择是否复盘"
            clearable
            :style="{ width: '100%' }"
          >
            <el-option
              v-for="(item, index) in isReplayOptions"
              :key="index"
              :label="item.label"
              :value="item.value"
              :disabled="item.disabled"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="丢标原因"
          prop="loseBiddingFile"
          v-if="formData.isBidding == 2 && formData.isReplay == 1"
        >
          <el-input
            v-model="formData.loseBiddingFile"
            type="textarea"
            placeholder="请输入丢标原因"
            :autosize="{ minRows: 4, maxRows: 4 }"
            :style="{ width: '100%' }"
          ></el-input>
        </el-form-item>
        <el-form-item size="mini">
          <el-button type="primary" @click="submitForm">提交</el-button>
          <el-button @click="resetForm">重置</el-button>
        </el-form-item>
      </el-form>
    </el-row>
  </div>
</template>
<script>
import BasicBusiness from "@/views/components/business/BasicBusiness.vue";
import Step from "@/views/components/business/Step.vue";
import { getProjectDetail, bidding } from "@/api/project/index";
import { getToken } from "@/utils/auth";
export default {
  components: { BasicBusiness, Step },
  props: [],
  data() {
    return {
      formData: {
        isBidding: undefined,
        biddingFileId: null,
        isReplay: undefined,
        loseBiddingFile: undefined,
      },
      rules: {
        isBidding: [
          {
            required: true,
            message: "请选择是否中标",
            trigger: "change",
          },
        ],
        isReplay: [],
        loseBiddingFile: [],
      },
      headers: {
        Authorization: "Bearer " + getToken(),
      },
      biddingFileIdAction: 
        "http://business.byteturing.com" +
        process.env.VUE_APP_BASE_API +
        "/common/upload",
      biddingFileIdfileList: [],
      isBiddingOptions: [
        {
          label: "是",
          value: 1,
        },
        {
          label: "否",
          value: 2,
        },
      ],
      isReplayOptions: [
        {
          label: "是",
          value: 1,
        },
        {
          label: "否",
          value: 2,
        },
      ],
    };
  },
  computed: {
    boId() {
      return this.$route.query.boId;
    },
    projectId() {
      return this.$route.query.projectId;
    },
  },
  watch: {},
  created() {},
  mounted() {
    this.loadData();
  },
  methods: {
    loadData() {
      this.$refs.basicBusinessRef.loadData(this.boId).then((res) => {});
      getProjectDetail(this.boId).then((res) => {
        ;
        this.stage = res.data.stage;
        this.$refs.stepRef.setStage(this.stage);
      });
    },
    submitForm() {
      this.$refs["elForm"].validate((valid) => {
        if (!valid) return;
        // TODO 提交表单
        bidding({
          ...this.formData,
          boId: this.boId,
          projectId: this.projectId,
        }).then((res) => {
          this.$message({
            message: "操作成功",
            type: "success",
          });
          this.$router.replace('/bid/index');
        });
      });
    },
    resetForm() {
      this.$refs["elForm"].resetFields();
    },
    biddingFileIdBeforeUpload(file) {
      let isRightSize = file.size / 1024 / 1024 < 100;
      if (!isRightSize) {
        this.$message.error("文件大小超过 100MB");
      }
      return isRightSize;
    },
    handleUploadSuccess(res, file) {
      this.formData.biddingFileId = res.fileId || res.biddingFileId;
    },
    handleRemove() {
      this.formData.biddingFileId = "";
    },
  },
};
</script>
<style></style>
